<template>
  <component :is="componentType(to)" v-bind="componentProps(to)">
    <slot></slot>
  </component>
</template>
<script>
import { Validator } from "@bigbighu/cms-utils";
export default {
  name: "AppLink",
  props: {
    to: {
      type: String,
      default: "",
    },
  },
  data() {
    return {};
  },
  methods: {
    // 计算组件类型
    componentType(url) {
      return Validator.isExternal(url) ? 'a' : 'router-link';
    },
    // 计算组件属性
    componentProps(url) {
      if (Validator.isExternal(url)) {
        return {
          href: url,
          target: "_blank",
          rel: "noopener",
        };
      } else {
        return {
          to: url,
        };
      }
    }
  },
};
</script>
